<script setup>
  import {ref} from "vue";

  defineProps({
    tabNames: {
      type: Array,
      default: () => ([])
    }
  })

  const recordCount = ref(0)

  const emits = defineEmits(['clickTab'])
  const clickTab = ({name}) => {
    emits('clickTab', name)
  }

  //将changeCount暴露出去
  defineExpose({recordCount})
</script>

<template>
  <div class="detailTab">
    <van-tabs v-model:active="recordCount" @clickTab="clickTab">
      <template v-for="(item,index) in tabNames" :key="index">
        <van-tab :title="item"/>
      </template>
    </van-tabs>
  </div>
</template>

<style lang="less" scoped>
  .detailTab {
    border-bottom: var(--auxiliary-gray-line);
  }
</style>